<template>
  <div class="accountList">
    <el-card >
      <div class="content">
          <div class="content-msg">合规社区：是否在pc端及小程序显示</div>
      <el-switch
        :disabled="permissions.indexOf('system:setting:community') == -1"
        style="display: block"
        v-model="status"
        active-color="#409eff"
        inactive-color="#ff4949"
        active-text="启用"
        inactive-text="禁用"
        :active-value="1"
        :inactive-value="0"
        @change="statusChange()"
      >
      </el-switch>
      </div>
     
    </el-card>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
export default {
  data() {
    return {
      status: false,
    };
  },
  computed: {
    ...mapGetters(["permissions"]),
  },
  methods: {
    getSetStatus() {
      this.$api.setDetail().then((res) => {
        if (res.data.code == "00000") {
          res.data.result == false ? (this.status = 0) : (this.status = 1);
        }
      });
    },
  async  statusChange() {
            try {
    const flag = this.status; // 点击之后的值
    this.status = this.status === 1 ? 0: 1; // switch点击前的状态
    const confirmTips = flag === 1 ? '启用' : '停用';
    const confirmTextTips = flag === 1 ? '显示' : '不显示';
    //确认框
    const confirm = await this.$confirm(`开关为${confirmTips}时，PC端及小程序${confirmTextTips}合规社区入口，确定${confirmTips}吗？`, '提示', {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }).catch(() => false);
    if (!confirm) return false;
   this.status = this.status === 1 ? 0: 1

    const res = await this.$api.setEdit(this.status);
      if (res.data.code == "00000") {
        this.$message.success("状态更新成功");
        
      }
        this.getUserList();
  } catch (error) {
     this.$message.error(error);
  }

    },
  },
  created() {
    this.getSetStatus();
  },
};
</script>
<style  lang='less' scoped>
.accountList {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 20px;
  .content{
   padding: 20px 0;
   .content-msg{
      margin-bottom: 20px;
   }
  }
}
</style>
